import Icon, { GithubOutlined } from '@ant-design/icons';
import { DefaultFooter } from '@ant-design/pro-components';
import React from 'react';

const Footer: React.FC = () => {
  const GiteeSvg = () => (
    <svg
      t="1716527603867"
      className="icon"
      viewBox="0 0 1024 1024"
      version="1.1"
      xmlns="http://www.w3.org/2000/svg"
      p-id="2595"
      width="1.2em"
      height="1.2em"
    >
      <path
        d="M512 960c-246.4 0-448-201.6-448-448s201.6-448 448-448 448 201.6 448 448-201.6 448-448 448z"
        fill="#D81E06"
        p-id="2596"
      ></path>
      <path
        d="M721.664 467.968h-235.52a22.272 22.272 0 0 0-20.736 20.736v51.776c0 10.368 10.368 20.736 20.736 20.736H628.48c10.368 0 20.736 10.304 20.736 20.672v10.368c0 33.664-28.48 62.08-62.144 62.08H392.896a22.272 22.272 0 0 1-20.672-20.672V436.928c0-33.664 28.48-62.08 62.08-62.08h287.36a22.272 22.272 0 0 0 20.736-20.736v-51.84a22.272 22.272 0 0 0-20.736-20.672h-287.36A152.96 152.96 0 0 0 281.6 434.368v287.36c0 10.304 10.368 20.672 20.736 20.672h302.848c75.072 0 137.216-62.08 137.216-137.216v-116.48a22.272 22.272 0 0 0-20.736-20.736z"
        fill="#FFFFFF"
        p-id="2597"
      ></path>
    </svg>
  );

  const GiteeIcon = (props: Partial<CustomIconComponentProps>) => (
      <Icon component={GiteeSvg} {...props} />
  );

  return (
    <DefaultFooter
      style={{
        background: 'none',
      }}
      copyright="Powered by Maktoub"
      links={[
        {
          key: 'name',
          title: 'Maktoub',
          href: 'https://gitee.com/maktoublwx',
          blankTarget: true,
        },
        {
          key: 'giteename',
          title: <GiteeIcon/>,
          href: 'https://gitee.com/maktoublwx/api-backend',
          blankTarget: true,
        },
        {
          key: 'Maktoublwx',
          title: 'Maktoublwx',
          href: 'https://gitee.com/maktoublwx/api-backend',
          blankTarget: true,
        },
      ]}
    />
  );
};

export default Footer;
